<template>
  <button type="primary" @click="addData">新增数据</button>
  <div>
    indexdb中的数据:{{ dbData }}
  </div>
</template>

<script setup>
import { ref, onBeforeUnmount } from 'vue';

import { dbGet, IndexedDBStampEnum } from '../worker/dbUtils.js';
import MyWorker from '../worker/testWork.js?worker';

const dbData = ref([]);
const worker = new MyWorker();
const ids = []

// worker.postMessage({ id: 1, test: 'aa', token: getToken() });
worker.onmessage = async (oEvent) => {
  console.log(oEvent.data);
  for (let i = 0; i < ids.length; i++) {
    const a = await dbGet(ids[i]);
    dbData.value.push(a)
  }


};
function addData() {
  const id =  Math.random() * 10
  ids.push(id);
  worker.postMessage({ id: id, test: 'aabb', token: '' });
}
// 销毁时销毁线程
onBeforeUnmount(() => {
  // 关闭线程
  worker.postMessage('stop');
});
</script>

<style scoped>
.avue-crud__menu {
  display: none;
}
</style>
